<!--
 * @Author: zxh
 * @Email: 1271027008@qq.com
 * @Date: 2020-03-11 16:37:12
 * @Descripttion: 仓库管理
 -->

<div class="subwarehouse_manage">
    <div nz-row nzGutter="16" class="row_1 row_2">
        <div nz-col nzSpan="7" class="operate_1">
            <button *ngIf="power.add" nz-button nzType="primary" (click)="showModalKF(1)"><i nz-icon nzType="plus"></i>新增</button>
            <button *ngIf="power.edit" nz-button nzType="" (click)="showModalKF(2)" [disabled]="deleteKFList.length !== 1"
                [class]="deleteKFList.length !== 1?'ant-btn ant-btn-primary defaultEditBg disabledBg':'ant-btn ant-btn-primary defaultEditBg'">
                <i nz-icon nzType="edit"></i>修改
            </button>
            <button *ngIf="power.del" nz-button nzType=""
                [class]="deleteKFList.length==0?'ant-btn ant-btn-primary defaultDeleteBg disabledBg':'ant-btn ant-btn-primary defaultDeleteBg'"
                (click)="deleteMorekf()" [disabled]="deleteKFList==0"><i nz-icon nzType="delete"></i>删除</button>
            <!-- <button nz-button nzType="" class="connect_k">连接库入库房区管理</button> -->
        </div>
        <div nz-col nzSpan="2"></div>
        <div nz-col nzSpan="5">
            <label>库房编号：</label>
            <input appHotSearch (hotSearchEmit)="getKFList('search')" nz-input placeholder="请输入库房编号"
                [(ngModel)]="kfCode" style="width: 67%;"/>
        </div>
        <div nz-col nzSpan="5">
            <label>库房名称：</label>
            <input appHotSearch (hotSearchEmit)="getKFList('search')" nz-input placeholder="请输入库房名称"
                [(ngModel)]="kfName" style="width: 67%;"/>
        </div>
        <div nz-col nzSpan="5">
            <label>存料类型：</label>
            <nz-select class="cl_select" [(ngModel)]="clType" (ngModelChange)="selectedCL($event)" nzDropdownClassName="select_custom" style="width: 67%;">
                <nz-option nzValue="" nzLabel="-请选择存料类型-"></nz-option>
                <nz-option *ngFor="let item of clList" [nzValue]="item.value" [nzLabel]="item.label"></nz-option>
            </nz-select>
        </div>
        <!-- <div nz-col nzSpan="2">
            <button class="search_btn" nz-button nzType="" (click)="searchList()"><i nz-icon
                    nzType="search"></i>搜索</button>
        </div> -->
    </div>
    <div nz-row class="row_2">
        
        <div nz-col nzSpan="24" class="table_1">
            <nz-table #rowSelectionTable [nzData]="listOfAllData" [nzFrontPagination]="false"
                (nzCurrentPageDataChange)="currentPageDataChange($event)" [nzBordered]="true" nzTitle="库房列表" nzSize="small">
                <thead>
                    <tr>
                        <th nzShowCheckbox [(nzChecked)]="isAllDisplayDataChecked" [nzIndeterminate]="isIndeterminate"
                            (nzCheckedChange)="checkAll($event)"></th>
                        <th>库房编号</th>
                        <th>库房名称</th>
                        <th>库房地址</th>
                        <th>独立仓库</th>
                        <th>库房类型</th>
                        <th>存料类型</th>
                        <!-- <th>操作</th> -->
                    </tr>
                </thead>
                <tbody>
                    <tr *ngFor="let data of rowSelectionTable.data" [class]="selectedKQ==data.id?'ant-table-row ng-star-inserted active':'ant-table-row ng-star-inserted'" (click)="showDetail(data.id)">
                        <td nzShowCheckbox [(nzChecked)]="mapOfCheckedId[data.id]" [nzDisabled]="data.disabled"
                            (nzCheckedChange)="refreshStatus()">
                        </td>
                        <td>{{ data.code }}</td>
                        <td>{{ data.name }}</td>
                        <td>{{ data.address }}</td>
                        <td>{{ data.independent?'是':'否' }}</td>
                        <td>{{ data.categoryLabel }}</td>
                        <td>{{ data.materialCategoryLabel }}</td>
                        <!-- <td class="operate_row">
                            <button style="margin-right:4px;" nz-button nzType="primary"
                                (click)="showModalKF(2,data)"><i nz-icon nzType="edit"></i></button>
                            <button nz-button nzType="danger" style="margin-right: 4px;"
                                (click)="geleteCurkf(data.id)"><i nz-icon nzType="delete"></i></button>
                            <a href="javascript:void(0);"
                                [class]="selectedKQ==data.id?'ant-btn ant-btn-default ant-btn-icon-only active':'ant-btn ant-btn-default ant-btn-icon-only'"
                                nz-button nzType="default" (click)="showDetail(data.id)"><i nz-icon
                                    nzType="eye"></i></a>
                        </td> -->
                    </tr>
                </tbody>
            </nz-table>
        </div>
        <div nz-col nzSpan="24" class="page_row">
            <nz-pagination [(nzPageSize)]="pageSize" [(nzPageIndex)]="currentKF" [nzTotal]="totalSizeKF"
                [nzShowTotal]="totalTemplate" (nzPageIndexChange)="clickPageKF($event)">
            </nz-pagination>
            <ng-template #totalTemplate let-total> 总共 {{totalSizeKF}} 条 </ng-template>
        </div>
    </div>
    <div nz-row class="line_row"></div>
    <div nz-row class="row_3" id="kqTable">
        <div nz-col nzSpan="24" class="operate_1">
            <button nz-button nzType="primary" (click)="showModalKQ(1)" [disabled]="isCanAddEdit"
            [class]="isCanAddEdit?'ant-btn ant-btn-primary defaultAddBg disabledBg':'ant-btn ant-btn-primary defaultAddBg'">
                <i nz-icon nzType="plus"></i>新增
            </button>
            <button nz-button nzType="" (click)="showModalKQ(2)" [disabled]="deleteKQList.length !== 1"
                [class]="deleteKQList.length !== 1?'ant-btn ant-btn-primary defaultEditBg disabledBg':'ant-btn ant-btn-primary defaultEditBg'">
                <i nz-icon nzType="edit"></i>修改
            </button>
            <button nz-button nzType="" [disabled]="deleteKQList.length == 0" (click)="deleteMorekq()" 
            [class]="deleteKQList.length==0?'ant-btn ant-btn-primary defaultDeleteBg disabledBg':'ant-btn ant-btn-primary defaultDeleteBg'">
                <i nz-icon nzType="delete"></i>删除
            </button>
        </div>
        <div nz-col nzSpan="24" class="table_2">
            <nz-table #rowSelectionTableDetail [nzData]="listOfAllDataDetail" [nzFrontPagination]="false" [nzBordered]="true"
                (nzCurrentPageDataChange)="currentPageDataChangeDetail($event)" nzTitle="库区列表" nzSize="small">
                <thead>
                    <tr>
                        <th nzShowCheckbox [(nzChecked)]="isAllDisplayDataCheckedDetail"
                            [nzIndeterminate]="isIndeterminateDetail" (nzCheckedChange)="checkAllDetail($event)"></th>
                        <th>库区编号</th>
                        <th>对应配墨编号</th>
                        <th>料仓编号</th>
                        <th>库区名</th>
                        <th>库区描述</th>
                        <th>库区类型</th>
                        <th>区域</th>
                        <!-- <th>操作</th> -->
                    </tr>
                </thead>
                <tbody>
                    <tr *ngFor="let data of rowSelectionTableDetail.data">
                        <td nzShowCheckbox [(nzChecked)]="mapOfCheckedIdDetail[data.id]" [nzDisabled]="data.disabled"
                            (nzCheckedChange)="refreshStatusDetail()">
                        </td>
                        <td>{{ data.code }}</td>
                        <td>{{ data.ink }}</td>
                        <td>{{ data.bunker }}</td>
                        <td>{{ data.name }}</td>
                        <td>{{ data.description }}</td>
                        <td>{{ data.categoryLabel }}</td>
                        <td>{{ data.areaLabel }}</td>
                        <!-- <td class="operate_row">
                            <button style="margin-right:4px;" nz-button nzType="primary"
                                (click)="showModalKQ(2,data)"><i nz-icon nzType="edit"></i></button>
                            <button (click)="geleteCurkq(data.id)" nz-button nzType="danger"
                                style="margin-right: 4px;"><i nz-icon nzType="delete"></i></button>
                        </td> -->
                    </tr>
                </tbody>
            </nz-table>
        </div>
        <!-- <div nz-col nzSpan="24" class="page_row">
            <nz-pagination [nzPageIndex]="1" [nzTotal]="50" [nzShowTotal]="totalTemplate">
            </nz-pagination>
            <ng-template #totalTemplate let-total> 总共 50 条 </ng-template>
        </div> -->
    </div>
</div>
<div id="modal_box_1"></div>
<nz-modal appDragModal nzMaskClosable="false" [nzGetContainer]="modalDomBoxA" class="kf_modal" (nzOnCancel)="handleCancelKF()" [(nzVisible)]="isVisibleKF"
    [nzTitle]="kfModalType==1?'新增库房':'修改库房'" [nzFooter]="null" nzMaskClosable="false">
    <form nz-form [formGroup]="KfForm" (ngSubmit)="submitKF()">
        <div nz-row nzGutter="16">
            <div nz-col nzSpan="12">
                <nz-form-item>
                    <nz-form-label [nzSpan]="10" nzRequired>库房编号</nz-form-label>
                    <nz-form-control [nzSpan]="14" nzErrorTip="请输入库房编号!">
                        <input nz-input formControlName="kfCodeModal" placeholder="请输入库房编号" />
                    </nz-form-control>
                </nz-form-item>
            </div>
            <div nz-col nzSpan="12">
                <nz-form-item>
                    <nz-form-label [nzSpan]="10" nzRequired>库房名称</nz-form-label>
                    <nz-form-control [nzSpan]="14" nzErrorTip="请输入库房名称!">
                        <input nz-input formControlName="kfNameModal" placeholder="请输入库房名称" />
                    </nz-form-control>
                </nz-form-item>
            </div>
        </div>
        <div nz-row nzGutter="16">
            <div nz-col nzSpan="12">
                <nz-form-item>
                    <nz-form-label [nzSpan]="10">库房地址</nz-form-label>
                    <nz-form-control [nzSpan]="14">
                        <input nz-input formControlName="kfAddrModal" placeholder="请输入库房地址" />
                    </nz-form-control>
                </nz-form-item>
            </div>
            <div nz-col nzSpan="12">
                <nz-form-item>
                    <nz-form-label [nzSpan]="10">独立仓库</nz-form-label>
                    <nz-form-control [nzSpan]="14">
                        <nz-switch class="modal_switch" formControlName="isIndependent" nzCheckedChildren="是"
                            nzUnCheckedChildren="否">
                        </nz-switch>
                    </nz-form-control>
                </nz-form-item>
            </div>
        </div>
        <div nz-row nzGutter="16">
            <div nz-col nzSpan="12">
                <nz-form-item>
                    <nz-form-label [nzSpan]="10" nzRequired>库房类型</nz-form-label>
                    <nz-form-control [nzSpan]="14" nzErrorTip="请选择库房类型!">
                        <nz-select class="select_term" formControlName="kfTypeModal" nzDropdownClassName="select_custom">
                            <nz-option *ngFor="let item of kfList" [nzValue]="item.value" [nzLabel]="item.label">
                            </nz-option>
                        </nz-select>
                    </nz-form-control>
                </nz-form-item>
            </div>
            <div nz-col nzSpan="12">
                <nz-form-item>
                    <nz-form-label [nzSpan]="10" nzRequired>存料类型</nz-form-label>
                    <nz-form-control [nzSpan]="14" nzErrorTip="请选择存料类型!">
                        <nz-select class="select_term" formControlName="clTypeModal" nzDropdownClassName="select_custom">
                            <nz-option *ngFor="let item of clList" [nzValue]="item.value" [nzLabel]="item.label">
                            </nz-option>
                        </nz-select>
                    </nz-form-control>
                </nz-form-item>
            </div>
        </div>
        <div class="kf_modal_footer">
            <div style="text-align: right;">
                <button nz-button type="button" nzType="default" (click)="handleCancelKF()">取消</button>
                <button nz-button nzType="primary">确定</button>
            </div>
        </div>
    </form>
</nz-modal>
<div id="modal_box_2"></div>
<nz-modal appDragModal nzMaskClosable="false" [nzGetContainer]="modalDomBoxB" class="kq_modal" [(nzVisible)]="isVisibleKQ" [nzTitle]="kqModalType==1?'新增库区':'修改库区'"
    (nzOnCancel)="handleCancelKQ()" [nzFooter]="null" nzMaskClosable="false">
    <form nz-form [formGroup]="kqForm" (ngSubmit)="submitKQ()">
        <div nz-row nzGutter="16">
            <div nz-col nzSpan="12">
                <nz-form-item>
                    <nz-form-label [nzSpan]="10" nzRequired>库区编号</nz-form-label>
                    <nz-form-control [nzSpan]="14" nzErrorTip="请输入库区编号!">
                        <input nz-input formControlName="kqCodeModal" placeholder="请输入库区编号" />
                    </nz-form-control>
                </nz-form-item>
            </div>
            <div nz-col nzSpan="12">
                <nz-form-item>
                    <nz-form-label [nzSpan]="10" nzRequired>库区名</nz-form-label>
                    <nz-form-control [nzSpan]="14" nzErrorTip="请输入库区名!">
                        <input nz-input formControlName="kqNameModal" placeholder="请输入库区名" />
                    </nz-form-control>
                </nz-form-item>
            </div>
          
        </div>
        <div nz-row nzGutter="16">
            <div nz-col nzSpan="12">
                <nz-form-item>
                    <nz-form-label [nzSpan]="10">料仓编号</nz-form-label>
                    <nz-form-control [nzSpan]="14" nzErrorTip="请输入料仓编号!">
                        <input nz-input formControlName="lcCodeModal" placeholder="请输入料仓编号" />
                    </nz-form-control>
                </nz-form-item>
            </div>
            <div nz-col nzSpan="12">
                <nz-form-item>
                    <nz-form-label [nzSpan]="10">配墨编号</nz-form-label>
                    <nz-form-control [nzSpan]="14" nzErrorTip="请输入配墨编号!">
                        <input nz-input formControlName="pmCodeModal" placeholder="请输入配墨编号" />
                    </nz-form-control>
                </nz-form-item>
            </div>
        </div>
        <div nz-row nzGutter="16">
            <div nz-col nzSpan="24">
                <nz-form-item>
                    <nz-form-label [nzSpan]="5">库区描述</nz-form-label>
                    <nz-form-control [nzSpan]="19">
                        <input nz-input formControlName="kqDescModal" placeholder="请输入库区描述" />
                    </nz-form-control>
                </nz-form-item>
            </div>
        </div>
        <div nz-row nzGutter="16">
            <div nz-col nzSpan="12">
                <nz-form-item>
                    <nz-form-label [nzSpan]="10">库区类型</nz-form-label>
                    <nz-form-control [nzSpan]="14">
                        <nz-select class="select_term" formControlName="kqTypeModal" nzDropdownClassName="select_custom">
                            <nz-option *ngFor="let item of kqTypeList" [nzValue]="item.value" [nzLabel]="item.label">
                            </nz-option>
                        </nz-select>
                    </nz-form-control>
                </nz-form-item>
            </div>
            <div nz-col nzSpan="12">
                <nz-form-item>
                    <nz-form-label [nzSpan]="10">区域</nz-form-label>
                    <nz-form-control [nzSpan]="14">
                        <nz-select class="select_term" formControlName="qyModal" nzDropdownClassName="select_custom">
                            <nz-option *ngFor="let item of kqqyList" [nzValue]="item.value" [nzLabel]="item.label">
                            </nz-option>
                        </nz-select>
                    </nz-form-control>
                </nz-form-item>
            </div>
        </div>
        <div class="kf_modal_footer">
            <div style="text-align: right;">
                <button nz-button type="button" nzType="default" (click)="handleCancelKQ()">取消</button>
                <button nz-button nzType="primary">确定</button>
            </div>
        </div>
    </form>
</nz-modal>